<template>
  <div class="cen-1">
    <!--左-->
    <left :carouselData="carouselData"></left>
    <!--中-->
    <centre :typeList="typeList" @handleClick="handleClick"></centre>
    <!--右-->
    <right :arrss="arrssk"></right>
  </div>
</template>

<script lang="ts" setup>
import left from './components/brlow/left.vue'
import right from './components/brlow/right.vue'
import centre from './components/brlow/centre.vue'
import {
  getNews,
  getTypeList,
  getApps,
  getCommonlyUsed
} from '@/services/Application'
import type {
  additionalProperties1,
  arrs1,
  arrss1
} from '@/services/types/Applic'
import { ElMessage, type TabsPaneContext } from 'element-plus'
const list = ref<arrs1>()
const typeList = ref<arrss1>([])
const obj = ref({
  startTime: '',
  endTime: '',
  page: 1,
  pageSize: 10,
  title: '',
  typeId: '1'
})
type ying = {
  category?: string
  name?: string
  theme?: string
}
const obj1 = ref<ying>({
  category: '',
  name: '',
  theme: ''
})
const list1 = ref<additionalProperties1>([])
const arr = async (obj: any) => {
  const res = await getApps(obj)
  if (Number(res.code) !== 200) {
    ElMessage.error('获取数据失败')
    return
  }
  list1.value = res.data
  console.log(res)
}
const pageSize = 10

const carouselData = computed(() => {
  let pages = []
  for (let i = 0; i < list1.value.length; i += pageSize) {
    pages.push(list1.value.slice(i, i + pageSize))
  }
  return pages
})
provide('list', list)
const handleClick = (tab: TabsPaneContext) => {
  const foundItem = typeList.value.find((item) => item.label === tab.props.name)
    ?.value
  if (foundItem !== undefined) {
    obj.value.typeId = foundItem
    getList(obj.value)
  } else {
    // 处理错误：没有找到时
    console.error(`没有找到 label 等于 ${tab.props.name} 的项目`)
    // 可以设置一个默认值，或者留空，视业务逻辑而定
    // typeId.value = defaultValue;
  }
}
const getList = async (obj: any) => {
  const res = await getNews(obj)
  list.value = res.data
}
const getType = async () => {
  const res = await getTypeList()
  typeList.value = res.data
}
const arrssk = ref<additionalProperties1>([])
const arrsk = async () => {
  const res = await getCommonlyUsed({ limit: 10 })
  console.log(res, 1111)
  arrssk.value = res.data
}
onMounted(async () => {
  await getType()
  await getList(obj.value)
  arr(obj1.value)
  arrsk()
})
</script>

<style lang="scss" scoped>
.cen-1 {
  height: 400px;
  /// background: #d4b00f;
  display: flex;
}
</style>
